import React from "react";
// import { Carousel } from "antd";
// import wgp1 from "./img/wgp1.jpg";
// import wgp2 from "./img/wgp2.jpg";
// import wgp3 from "./img/wgp3.jpg";
import "./index.css";
// import HomeImg from "./img/HomeImg.jpg";
import down from "./img/down.png";
import { allStore } from "../../../store/AllStore";
export class CarouselCompent extends React.Component {
  SeeMore = () => {
    const element = document.getElementById("moduleOne");
    if(!element){return}
    const rect = element.getBoundingClientRect();  
    if(rect.top){
      window.scrollTo({
        top: rect.top + window.scrollY-70,
        behavior: "smooth"
      });
    }   
  };
  render() {
    return (
      <div id="moduleZero" style={{paddingTop:70,borderBottom:"1px solid #e8e8e8"}}>
        <div
          onClick={this.SeeMore}
          style={{
            position: "absolute",
            width: "100%",
            textAlign: "center",
            zIndex: 4,
            top: "90vh",
            cursor:"pointer"
          }}
        >
          <img style={{ height: 32 }} alt="暂无数据" src={down} />
          <div style={{ fontWeight: "bold", fontSize: 14 }}>
            {allStore.isEnglish ? "READ MORE" : "了解更多"}
          </div>
        </div>
        {/* <Carousel>
          <img src={wgp3} alt="暂无数据"></img>
          <img src={wgp1} alt="暂无数据"></img>
          <img src={wgp2} alt="暂无数据"></img>
        </Carousel> */}
        <div
        className="home-img"
          // style={{ height: "100vh", width: "100%" }}
          // src={HomeImg}
          alt="暂无图片"
        />
      </div>
    );
  }
}
